<template>
  <div>
    <tableCommon :tableData="tableData" :columns="columns" :loading="loading" :pageObj="pageObj" :showIndex="true">
      <el-table-column slot="op" label="操作" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="editData(scope.row)">编辑</el-button>
          <el-button size="mini" type="text" @click="delData(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </tableCommon>
  </div>
</template>
<script>
import tableCommon from '@/components/tableCommon/tableCommon'
export default {
  components: { tableCommon },
  data() {
    return {
      loading: true,
      tableData: [],
      columns: [
        { label: '创建人', prop: 'creator' },
        { slot: 'op' }// 操作列
      ],
      pageObj: {
        show: true,
        pageSize: 10,
        total: 0,
        pageIndex: 1,
        pageIndexChange: (val) => {
          console.log(`当前页: ${val}`);
          this.pageObj.pageIndex = val
          this.getData()
        },
        sizeChange: (val) => {
          console.log(`每页 ${val} 条`);
          this.pageObj.pageSize = val
          this.getData()

        },
      }
    }
  },
  created() {
    this.getData()
  },
  methods: {
    getData() {
        this.loading = true
      setTimeout((e) => {
        if (this.loading) {
          this.loading = false
        }
      }, 10000)
      setTimeout(() => {
            this.pageObj.total = 1
            this.tableData =[{creator:'张三'}]
            this.loading = false
          }, 200);
    //   this.$api.typequery(`?page.index=${this.pageObj.pageIndex}&page.size=${this.pageObj.pageSize}&VagueQueryTypeName=${this.form.VagueQueryTypeName}`).then(res => {
    //     if (res.code == 1) {
    //       setTimeout(() => {
    //         this.pageObj.total = res.data.total
    //         this.tableData = res.data.rows
    //         this.loading = false
    //       }, 200);
    //     }
    //   })
    }
  }
}
</script>